<template>
  <scroll-view class="form-page" scroll-y enable-flex>
    <view class="form-card">
      <view class="form-item" v-for="(field, idx) in fields" :key="idx">
        <text class="label">{{ field.label }}</text>

        <!-- 输入框 -->
        <input
          v-if="field.type === 'input'"
          v-model="form[field.key]"
          :type="field.inputType || 'text'"
          class="input"
          :placeholder="field.placeholder"
        />

        <!-- 选择器 -->
        <picker
          v-else-if="field.type === 'picker'"
          :range="field.range"
          :value="field.range.indexOf(form[field.key])"
          @change="(e) => (form[field.key] = field.range[e.detail.value])"
        >
          <view class="picker">{{ form[field.key] || field.placeholder }}</view>
        </picker>
      </view>

      <button class="save-btn" @click="save">保存</button>
    </view>
  </scroll-view>
</template>

<script>
import {
  addProject,
  editProject
} from '../../api/sale/customer.js';

export default {
  data() {
    return {
      id: null,
      form: {},
      fields: [
        { key: 'customer_name', label: '客户名称', placeholder: '请输入', type: 'input' },
        { key: 'customer_company_name', label: '客户公司名称', placeholder: '请输入', type: 'input' },
        { key: 'project_name', label: '工程名称', placeholder: '请输入', type: 'input' },
        { key: 'manager_phone', label: '负责人电话', placeholder: '请输入', type: 'input', inputType: 'number' },
        { key: 'site_manager', label: '现场管理人', placeholder: '请输入', type: 'input' },
        { key: 'site_manager_phone', label: '现场负责人电话', placeholder: '请输入', type: 'input', inputType: 'number' },

        { key: 'customer_source', label: '客户来源', placeholder: '请选择', type: 'picker', range: ['线上', '线下', '转介绍', '其它'] },
        { key: 'customer_level', label: '客户等级', placeholder: '请选择', type: 'picker', range: ['A', 'B', 'C', '未知'] },
        { key: 'follow_status', label: '跟进状态', placeholder: '请选择', type: 'picker', range: ['待跟进', '跟进中'] },
        { key: 'input_address', label: '生成工地', placeholder: '请输入', type: 'input' },
        { key: 'production_quantity', label: '生产量', placeholder: '请输入', type: 'input', inputType: 'number' },
        { key: 'product_model', label: '产品型号', placeholder: '请输入', type: 'input' }
      ]
    };
  },
  onLoad(options) {
    if (options.id) {
      this.id = Number(options.id);
      
      // 如果传递了数据，直接使用
      if (options.data) {
        try {
          const itemData = JSON.parse(decodeURIComponent(options.data));
          this.form = { ...itemData };
        } catch (error) {
          console.error('解析传递数据失败:', error);
          // 如果解析失败，使用默认值
          this.initDefaultForm();
        }
      } else {
        // 如果没有传递数据，使用默认值
        this.initDefaultForm();
      }
    } else {
      // 新增时，初始化表单数据
      this.initDefaultForm();
    }
  },
  
  methods: {
    initDefaultForm() {
      // 初始化默认表单数据，下拉选择器默认选中第一个
      this.form = {
        follow_status: '跟进中', // 默认选中第一个
        customer_source: '线上', // 默认选中第一个
        customer_level: 'A' // 默认选中第一个
      };
    },
    async save() {
      // 过滤掉 sales_name 字段，不提交到后端
      const { sales_name, ...submitData } = this.form;
      
      if (this.id) {
        await editProject({ ...submitData, id: this.id });
      } else {
        await addProject(submitData);
      }
      uni.showToast({ title: '保存成功', icon: 'none' });
      // 直接返回上一页，onShow会自动刷新
      setTimeout(() => uni.navigateBack(), 500);
    }
  }
};
</script>

<style lang="scss" scoped>
.form-page {
  min-height: 100vh;
  background: #f5f6fa;
  padding: 30rpx 30rpx 60rpx;
  box-sizing: border-box;
}
.form-card {
  background: #fff;
  border-radius: 16rpx;
  padding: 30rpx;
}
.form-item {
  margin-bottom: 30rpx;
  .label {
    font-size: 28rpx;
    color: #333;
    margin-bottom: 12rpx;
    display: block;
  }
  .input,
  .picker {
    width: 100%;
    height: 80rpx;
    line-height: 80rpx;
    border: 1rpx solid #ccc;
    border-radius: 12rpx;
    font-size: 28rpx;
    padding: 0 20rpx;
    box-sizing: border-box;
    color: #666;
  }
  .picker {
    display: flex;
    align-items: center;
  }
}
.save-btn {
  width: 100%;
  height: 90rpx;
  line-height: 90rpx;
  border-radius: 12rpx;
  background: #409eff;
  color: #fff;
  font-size: 32rpx;
  margin-top: 20rpx;
}
</style>
